<script setup lang="ts">
import type { CategoryItem } from '@/types/home'

defineProps<{
  list: CategoryItem[]
}>()
</script>

<template>
  <view class="category">
    <navigator class="category-item" hover-class="none" url="/pages/index/index" v-for="item in list" :key="item.id">
      <image class="icon" :src="item.icon"> </image>
      <!-- 知识点：uniappp普通文字text标签在H5环境下无法被flex布局影响，所以这里改为view -->
      <view class="text">{{ item.name }}</view>
    </navigator>
  </view>
</template>

<style lang="scss">
@import './style/CategoryPanel.scss';
</style>
